<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Courier</title>
    <link rel="stylesheet" href="/layui/css/layui.css">
    <link rel="stylesheet" href="/css/main.css"/>
    <script src="/layui/layui.js" charset="utf-8"></script>
</head>
<body>

<div th:include="/common/courierHead :: head"></div>

<div class="content">

    <div class="user_info">
        <div class="info_img">
            <img src="/images/headCourier.jpg"/>
        </div>
        <div class="info_phone" th:text="${session.get('SESSION_USER').phone}">
            13544370963
        </div>
        <div class="info_action">
            <div><img src="/images/setting.png">个人信息</div>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <div id="user_logout"><img src="/images/loginout.png">退出登录</div>
        </div>
        <hr/>
        <div class="user_action">
            <div class="user_do">
                <div><img src="/images/工作量.png"></div>
                <div>本月工作量</div>
                <div><a id="month_sum_num" style="font-size: 20px ;color: crimson">000</a></div>
                <!--<div class="red">会员积分0</div>-->
            </div>
            <div class="user_do">
                <div><img src="/images/收件数.png"></div>
                <div>收件个数</div>
                <div><a id="month_fetch_num" style="font-size: 20px ;color: crimson">000</a></div>

            </div>
            <div class="user_do">
                <div><img src="/images/派件数.png"></div>
                <div>派件个数</div>
                <div><a id="month_deliver_num" style="font-size: 20px ;color: crimson">000</a></div>
            </div>
            <div class="user_do">
                <div><img src="/images/派送区域.png"></div>
                <div>派送区域</div>
                <div><a id="working_area"  style="font-size: 20px ;color: crimson">太平</a></div>
            </div>
            <div class="user_do" id="link_state">
                <div><i class="layui-icon layui-icon-face-smile-b" style="font-size: 40px"></i></div>
                <div>工作状态</div>
                <div style="font-size: 18px ;color: green">点我打卡</div>
            </div>
            <div class="user_do">
                <div class="site-demo-button" id="layerDemo" style="margin-bottom: 0;">
                    <button data-method="notice" class="layui-btn" style="background-color: #fff">
                        <i class="layui-icon layui-icon-rmb" style="font-size: 40px;color: black" ></i>
                    </button>
                </div>

                <div style="font-size: 20px ">工资</div>
            </div>

        </div>
    </div>

    <div class="pagcke_new">
        <div class="msg_title">扫码查单</div>
        <label class="layui-form-label">运单号</label>
        <div class="layui-input-block">
            <input type="text" name="title" required  lay-verify="required"
                   autocomplete="off" class="layui-input" style="width: 40%"
                   placeholder="输入运单号进行查询，单次提交一条">
            <button class="layui-btn" lay-submit lay-filter="formDemo">查单</button>
        </div>
    </div>


</div>


<div th:include="/common/footer :: footer"></div>

</div>


<script>
    layui.use('layer', function(){ //独立版的layer无需执行这一句
        var $ = layui.jquery, layer = layui.layer; //独立版的layer无需执行这一句

        //触发事件
        var active = {
            notice: function(){
                //示范一个公告层
                layer.open({
                    type: 1
                    ,title: false //不显示标题栏
                    ,closeBtn: false
                    ,area: '300px;'
                    ,shade: 0.8
                    ,id: 'LAY_layuipro' //设定一个id，防止重复弹出
                    ,btn: ['为什么？', '好的']
                    ,btnAlign: 'c'
                    ,moveType: 1 //拖拽模式，0或者1
                    ,content: '<div style="padding: 50px; line-height: 22px; background-color: #393D49; color: #fff; font-weight: 300;">' +
                        '亲！你的工资是<br>工作量'+(fetchNum+deliverNum)+'*0.8+1500的底薪<br>所以你的工资是'+((fetchNum+deliverNum)*0.8+1500)+'元<br>' +
                            '赶快加油吧~'+
                        '</div>'
                    ,success: function(layero){
                        var btn = layero.find('.layui-layer-btn');
                        btn.find('.layui-layer-btn0').attr({
                            href: 'http://www.baidu.com/'
                            ,target: '_blank'
                        });
                    }
                });
            }
        };

        $('#layerDemo .layui-btn').on('click', function(){
            var othis = $(this), method = othis.data('method');
            active[method] ? active[method].call(this, othis) : '';
        });

    });


</script>
<script src="/js/jquery.1.8.3.min.js"></script>
<script>
    $("#link_state").click(function () {

        location.href="/courier/state";
    });
    $("#user_logout").click(function () {
        location.href="/logout";
    })
    var fetchNum=0;
    var deliverNum=0;
    //给收件量赋值
    $.ajax({
        url: '/courier/getThisMonthFetchNum',
        method: 'GET',
        async: false
    }).success(function(data){
        console.log(data);
        $("#month_fetch_num").text(data);
        fetchNum=data;
    });
    //给派件量赋值
    $.ajax({
        url: '/courier/getThisMonthDeliverNum',
        method: 'GET',
        async: false
    }).success(function(data){
        console.log(data);
        deliverNum=data;
        $("#month_deliver_num").text(data);
    });
    //给工作量量赋值
    $("#month_sum_num").text(fetchNum+deliverNum);
    //给工作区赋值
    $.ajax({
        url: '/courier/getWorkingAreaNameByUserId',
        method: 'GET',
        async: false
    }).success(function(data){
        console.log(data);
        $("#working_area").text(data);
    });
</script>
</body>
</html>